{% extends "printables_list.html" %}
{% load humanize i18n l10n %}

{% block header %}
  <div class="row d-print-none p-3 d-flex justify-content-between">
    <div class="h3 pt-1">
      {% trans "Printable Scoresheets" %}
      {% blocktrans trimmed with round=round.name asvar subtitle %}
        for {{ round }}
      {% endblocktrans %}
      <small class="text-muted d-md-inline d-none">{{ subtitle }}</small>
    </div>
    <button class="btn btn-outline-primary" data-toggle="modal" data-target="#editMotionsModal">
      {% trans "Edit Motion(s)" %}
    </button>
  </div>

{% endblock %}

{% block content %}

  <div id="vueMount">
    <template v-for="ballot in ballots">
      <div class="db-page-holder">
  		  <main role="main" class="db-page db-flex-column db-page-landscape">
          <printable-ballot :ballot="ballot" :kind="'Scoresheet'"
                            :round-info="roundInfo"
                            :ordinals="ordinals"></printable-ballot>
        </main>
      </div>
    </template>
    <div v-if="ballots.length === 0" class="alert alert-warning">
      {% trans "There are no scoresheets available — perhaps the round has not been drawn?" %}
    </div>

    <div class="modal fade" id="editMotionsModal" tabindex="-1" role="dialog" aria-hidden="true">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <div class="modal-header">
            <h3 class="modal-title">{% trans "Edit Ballot Motions" %}</h3>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">{% trans "&times;" %}</span>
            </button>
          </div>
          <div class="modal-body">
            <p class="lead">
              {% blocktrans trimmed %}
                Editing motions here will not save them permanently — it will only
                update the text used in the printed ballots below. This can be useful if using
                placeholder motions (to ensure confidentiality) in Tabbycat, but you still want to print
                ballots with correct motions.
              {% endblocktrans %}
            </p>
            <div v-for="motion in roundInfo.motions">
              <h5 class="mt-3">{% trans "Motion" %}<span v-if="roundInfo.motions.length > 1"></span></h5>
              <textarea v-model="motion.text" class="form-control"></textarea>
            </div>
            <div class="text-info text-center mt-3">
              {% trans "Changes to motions will update in the displayed ballots automatically" %}
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>

{% endblock content %}

{% block js %}
  <style>
    @media print {
      @page {
        size: landscape;
      }
    }
  </style>
  <script>
    window.vueData = {
      // Strings to Fill In
      roundInfo: {
        tournamentName: '{{ tournament.short_name }}',
        returnLocation: '{{ pref.score_return_location }}',
        votingBallots: {% if round.ballots_per_debate == 'per-adj' %}true{% else %}false{% endif %},
        // Formatting
        showTabRoomRow: true,
        showEmoji: {% if pref.show_emoji %}true{% else %}false{% endif %},
        // From Django
        round: '{{ round.name }}',
        hasReplies: {% if pref.reply_scores_enabled %}true{% else %}false{% endif %},
        isBP: {% if pref.teams_in_debate == 'two' %}false{% else %}true{% endif %},
        speakersCount: {{ pref.substantive_speakers }},
        showDigits: {% if pref.ballots_confirm_digits %}true{% else %}false{% endif %},
        hideMotions: {% if pref.ballots_hide_motions %}true{% else %}false{% endif %},
        // Rules
        infoText: '{% trans "Speeches are x minutes, the speaker score range is from x to x. You have x minutes to form an adjudication." %}',
        hasMotions: {% if pref.enable_motions %}true{% else %}false{% endif %},
        hasVetoes: {% if pref.motion_vetoes_enabled %}true{% else %}false{% endif %},
        // Formatting
        showTabRoomRow: true,
        showInfoRow: false,
        showAdjInstitutions: '{{ pref.show_adjudicator_institutions|unlocalize }}',
        substantiveMin: '{{ pref.score_min|unlocalize }}',
        substantiveMax: '{{ pref.score_max|unlocalize }}',
        substantiveStep: '{{ pref.score_step|unlocalize }}',
        replyMin: '{{ pref.reply_score_min|unlocalize }}',
        replyMax: '{{ pref.reply_score_max|unlocalize }}',
        replyStep: '{{ pref.reply_score_step|unlocalize }}',
        motions: {{ motions|safe }},
        teamCodes: {{ use_team_code_names|lower }},
      },
      // From Django
      ballots: {{ ballots|safe }},
      ordinals: {{ ordinals|safe }},
    }
  </script>
  {{ block.super }}

{% endblock js %}
